﻿@using ZhongKeSite.Entity;
@{
    Company company = ViewBag.CompanyInfo;
}
<div class="page-product-radix">
    <div class="vidBox" id="vidBox">
        <div class="videCont">
            <a class="btn-close" id="btn-close" href="javascript:void(0);"><i class="iconfont iconsearchclose"></i></a>
            <video src="/portal/img/about.mp4" loop controls></video>
        </div>
    </div>
    <section class="comment-s1">
        <video autoplay poster="/portal/img/ra_01.jpg" id="videobg" loop>
            <source src="/portal/img/about.mp4" type="video/mp4">Your browser does not support the video tag. I suggest you upgrade your browser.
        </video>
        <div class="container">
            <h1 class="text100">快装，灵活，易用</h1><a class="btn-play" id="openVideo" href="javascript:void(0);"> <img src="/portal/img/play.png" alt=""></a>
        </div>
    </section>
    <section class="s2">
        <div class="container">
            <div class="txt">
                <h2 class="text80 wow fadeInUp">RADIX</h2>
                <h3 class="text50 wow fadeInUp" data-wow-delay="0.5s">模块化多层水培生长系统</h3>
                <div class="des text20 wow fadeInUp" data-wow-delay="1s">快速拆装，可选层高，可灵活组合，正是 RADIX 的独特之处。一体化光系统，配置 80 余种植物光谱，支持 NFT/DFT 双营养液供给模式切换，这⼀次，RADIX 重新定义植物⽣⻓系统。⽆论地球或太空，只要你想，都可以像搭乐⾼⼀样创建植物⼯⼚。</div>
            </div>
            <figure class="text-center wow fadeInUp"><img src="/portal/img/pro_04.png" alt="模块化多层水培生长系统"></figure>
            <div class="reddot wow fadeInRight"><img src="/portal/img/reddot.png" alt="红点奖"></div>
        </div>
    </section>
    <section class="s3">
        <div class="container">
            <div class="txt">
                <h3 class="text50 wow fadeInUp">30分钟模块化拆装</h3>
                <div class="des text20 wow fadeInUp" data-wow-delay="0.5s">无需专业安装人员和工具，两人30分钟便可轻松完成一套标准 RADIX 组装或拆卸。 组装快，投产快，结构稳固，有效改善搭建植物工厂的工程繁琐与低扩展性。 </div>
            </div>
            <figure class="text-center wow fadeInUp"><img src="/portal/img/pro_05.jpg" alt="30分钟模块化拆装"></figure>
        </div>
    </section>
    <section class="s3">
        <div class="container">
            <div class="txt">
                <h3 class="text50 wow fadeInUp">可选择层高</h3>
                <div class="des text20 wow fadeInUp" data-wow-delay="0.5s">为满足不同作物生长对空间的需求，RADIX 提供四种尺寸的层高模块，自由组合，灵活多变，<br>像搭积木一样创建或扩建你的植物工厂。<br>RADIX 亦可根据各建筑类型植物工厂、种植品种等需求进行尺寸定制。 </div>
            </div>
            <div class="box">
                <div class="row">
                    <div class="col order-last">
                        <div class="pic2"><img src="/portal/img/pro_06.png" alt="30分钟模块化拆装"></div>
                    </div>
                    <div class="col">
                        <div class="des">
                            <div class="num text80">2863</div>
                            <p class="text24">总高度（mm）</p>
                        </div>
                        <div class="des">
                            <div class="num text80">6</div>
                            <p class="text24">层数（层）</p>
                        </div>
                        <div class="des">
                            <div class="num text80">28</div>
                            <p class="text24">层高（cm）</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="s3">
        <div class="container">
            <div class="txt">
                <h3 class="text50 wow fadeInUp">独立光系统</h3>
                <div class="des text20 wow fadeInUp" data-wow-delay="0.5s">RADIX 采用三安光电自主研发新型 LED 芯片，精准配置 80 余种植物专用光谱，以满足160 多种<br>作物全生长阶段光照需求。 <br>RADIX 内置光照系统中，光谱及灯具型号均可选。</div>
            </div>
            <div class="des1">
                <div class="row">
                    <div class="col">
                        <div class="num text80">2.1</div>
                        <p class="text24">单灯光效</p>
                    </div>
                    <div class="col">
                        <div class="num text80">24</div>
                        <p class="text24">PPF (umol/s)</p>
                    </div>
                    <div class="col">
                        <div class="num text80">11.5</div>
                        <p class="text24">单灯功率(W)</p>
                    </div>
                </div>
            </div>
            <div class="chart-container swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"><img src="/portal/img/pro_07.png" alt=""></div>
                    <div class="swiper-slide"><img src="/portal/img/pro_07.png" alt=""></div>
                    <div class="swiper-slide"><img src="/portal/img/pro_07.png" alt=""></div>
                </div>
                <div class="swiper-pagination"></div>
            </div>
        </div>
    </section>
    <section class="s3">
        <div class="container">
            <div class="txt">
                <h3 class="text50 wow fadeInUp">双液流切换</h3>
                <div class="des text20 wow fadeInUp" data-wow-delay="0.5s">创新拦水坝与分水条设计，实现 NFT/DFT 双营养液供给模式逐层切换，不仅能满足不同植物根系<br>生长需求，亦能一体多用，一层育苗，一层生长。<br>整体采用营养液重力驱动自上而下逐层供液，实现营养液循环方式多样化。</div>
            </div>
            <div class="tab-container">
                <ul class="tab-header">
                    <li class="active">NFT</li>
                    <li>DFT</li>
                </ul>
                <div class="tab-body"><img src="/portal/img/pro_08.jpg" alt=""></div>
            </div>
        </div>
    </section>
    <section class="s3">
        <div class="container">
            <div class="txt">
                <h3 class="text50 wow fadeInUp">隐藏水电路</h3>
                <div class="des text20 wow fadeInUp" data-wow-delay="0.5s">RADIX 设计灵感源于积木的多面拼装特性，创造性提出模块化设计理念。 <br>RADIX 采用绝缘性结构材料，并将水电系统隐藏于中空立柱和栽培槽结构中，方便安装，<br>防止电路外露带来的安全隐患。</div>
            </div>
            <figure class="text-center wow fadeInUp"><img src="/portal/img/pro_09.jpg" alt=""></figure>
        </div>
    </section>
    <section class="s3 s4">
        <div class="container">
            <div class="txt">
                <h3 class="text50 wow fadeInUp">根系生长健康发达</h3>
            </div>
            <figure class="text-center wow fadeInUp"><img src="/portal/img/pro_10.jpg" alt=""></figure>
        </div>
    </section>
    <section class="comment-s9">
        <div class="container">
            <h3 class="text-center text50 wow fadeInUp">可种植作物</h3>
        </div>
        <div class="pic wow fadeInUp">       <img src="/portal/img/pro_11.jpg" alt=""></div>
    </section>
    <section class="comment-s10">
        <div class="container text-center">
            <h2 class="title text80 wow fadeInUp">UPLIFT</h2>
            <h3 class="title1 text50 wow fadeInUp" data-wow-delay="0.5s">无人化垂直农业生产系统</h3>
            <div class="des text20 wow fadeInUp" data-wow-delay="1s">
                <p><span>无人种植车间</span>|<span>数字生产系统</span>|<span>超高空间扩展</span></p>
            </div>
        </div>
        <div class="pic wow fadeInUp">              <img src="/portal/img/sulo_10.jpg" alt=""></div><a class="download wow fadeInUp" href="#">参数下载</a>
    </section>
    <section class="comment-s11">
        <div class="container">
            <h3 class="text-center text50 wow fadeInUp">成功案例</h3>
        </div>
        <div class="swiper-container swiper-s11">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="/portal/img/sulo_11.jpg" alt=""></div>
                <div class="swiper-slide"><img src="/portal/img/sulo_11.jpg" alt=""></div>
                <div class="swiper-slide"><img src="/portal/img/sulo_11.jpg" alt=""></div>
            </div>
            <div class="swiper-pagination"></div>
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
        </div>
    </section>
    <section class="comment-s12">
        <div class="container">
            <h3 class="text-center text50 wow fadeInUp">告诉我们您需要哪方面的支持</h3>
        </div>
        <div class="s3-formcontact">
            <div class="container">
                <div class="row">
                    <div class="col-md">
                        @{Html.RenderPartial("UcEmail");}
                    </div>
                    <div class="col-md-auto">
                        <div class="contact">
                            <h4 class="title wow fadeInUp"> 通过电话或邮箱寻求支持</h4>
                            <div class="row">
                                <div class="col col-md-12">
                                    <div class="item wow fadeInUp">
                                        <div class="pic"><i class="iconfont icondianhua"></i></div>
                                        <div class="title">服务热线</div>
                                        <div class="val">@company.ServicePhone</div>
                                    </div>
                                </div>
                                <div class="col col-md-12">
                                    <div class="item wow fadeInUp">
                                        <div class="pic"><i class="iconfont iconyouxiang"></i></div>
                                        <div class="title">联系邮箱                                    </div>
                                        <div class="val">@company.Email</div>
                                        <div class="val">@company.ServiceEmail</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
@section scripts {
    <script src="~/portal/js/vendor/swiper/js/swiper.min.js"></script>
    <script>
        var swiper = new Swiper('.chart-container', {
            autoplay: {
                delay: 2500,
                disableOnInteraction: false,
            },
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
            },

        });

        var swiper2 = new Swiper('.swiper-s11', {
            slidesPerView: 'auto',
            centeredSlides: true,
            spaceBetween: 120,
            autoplay: {
                delay: 2500,
                disableOnInteraction: false,
            },
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },
            pagination: {
                el: '.swiper-pagination'
            },
        });
        $(function () {

            $("#openVideo").click(function (e) {
                $("#vidBox").fadeIn();
            })
            $("#btn-close").click(function (e) {
                $("#vidBox").fadeOut();
            })

        });
    </script>
}